import 'package:flutter/material.dart';


class ScrollTabsFixed extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        // appBar: AppBar(title: Text('Flutter 吸顶示例')),
        body: NestedScrollExample(),
      ),
    );
  }
}

class NestedScrollExample extends StatefulWidget {
  @override
  State<NestedScrollExample> createState() => _NestedScrollExampleState();
}

class _NestedScrollExampleState extends State<NestedScrollExample> {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              // title: const Text('吸顶标题'),
              pinned: false,
              floating: false,
              expandedHeight: 260.0,
              flexibleSpace: FlexibleSpaceBar(
                background: Image.network(
                  "https://via.placeholder.com/350x150",
                  fit: BoxFit.cover,
                ),
              ),
            ),
            SliverPersistentHeader(
              delegate: _SliverAppBarDelegate(const TabBar(
                labelColor: Colors.black87,
                unselectedLabelColor: Colors.grey,
                tabs: [
                  Tab(text: "标签一"),
                  Tab(text: "标签二"),
                  Tab(text: "标签三"),
                ],
              )),
              pinned: true,
            ),
          ];
        },
        body: TabBarView(
          children: [
            Center(child: Text("第一个标签的内容")),
            Center(child: Text("第二个标签的内容")),
            Center(child: Text("第三个标签的内容"))
          ],
        ),
      ),
    );
  }
}

class _SliverAppBarDelegate extends SliverPersistentHeaderDelegate {
  _SliverAppBarDelegate(this._tabBar);

  final TabBar _tabBar;

  @override
  double get minExtent => _tabBar.preferredSize.height;
  @override
  double get maxExtent => _tabBar.preferredSize.height;

  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
    return new Container(
      color: Colors.white,
      child: _tabBar,
    );
  }

  @override
  bool shouldRebuild(_SliverAppBarDelegate oldDelegate) {
    return false;
  }
}
